﻿
		<div class="mui-content mui-row mui-fullscreen mt45">
			<div class="mui-col-xs-3" style="background: #f3f4f6;">
				<div id="segmentedControls" class="mui-segmented-control mui-segmented-control-inverted mui-segmented-control-vertical">
					<a style="width: 100%;padding: 8px 0" class="mui-control-item" href="#content0">茶具系列</a>
					<hr style="    height: 1px;    margin: 0;" />
					<a style="width: 100%;padding: 8px 0"  class="mui-control-item" href="#content1">银品生活</a>
					<hr style="    height: 1px;    margin: 0;" />
					<a style="width: 100%;padding: 8px 0"  class="mui-control-item" href="#content2">宗教文化</a>
					<hr style="    height: 1px;    margin: 0;" />
					<a style="width: 100%;padding: 8px 0"  class="mui-control-item" href="#content3">家居摆件</a>
					<hr style="    height: 1px;    margin: 0;" />
					<a style="width: 100%;padding: 8px 0"  class="mui-control-item" href="#content4">皇家饰品</a>
					<hr style="    height: 1px;    margin: 0;" />
					<!--<a style="width: 100%;"  class="mui-control-item" href="#content5">投资理财</a>
					<hr style="    height: 1px;    margin: 0;" />-->
				</div>
			</div>
			<div id="segmentedControlContents" class="mui-col-xs-9" style="padding-bottom: 68px;">

				<div id="content0" class="mui-control-content">
					<div class="mui-table-view" style="padding:0 10px; float: left; width: 100%; min-height: 100%;">
						<ul class="fenlei_list pinpai_login" style="">
							<?php foreach($output['goods_list_wh'] as $v){?>
							<li><a href="index.php?act=goods&op=goods_detail&goods_id=<?php echo $v['goods_id']; ?>"><img src="<?php echo cthumb($v['goods_image'], 265, $_value['store_id']);?>"></a></li>
							<?php }?>								
						</ul>&nbsp;
						<div style="clear: both; height: 12px;"></div>
					</div>
				</div>
				<div id="content1" class="mui-control-content">
					<div class="mui-table-view" style="padding:0 10px; float: left; width: 100%; min-height: 100%;">
						<ul class="fenlei_list pinpai_login" style="">
							<?php foreach($output['goods_list_kz'] as $v){?>
								<li><a href="index.php?act=goods&op=goods_detail&goods_id=<?php echo $v['goods_id']; ?>"><img src="<?php echo cthumb($v['goods_image'], 265, $_value['store_id']);?>"></a></li>
							<?php }?>
						</ul>&nbsp;
						<div style="clear: both; height: 12px;"></div>
					</div>
				</div>
				<div id="content2" class="mui-control-content">
					<div class="mui-table-view" style="padding:0 10px; float: left; width: 100%; min-height: 100%;">
						<ul class="fenlei_list pinpai_login" style="">
							<?php foreach($output['goods_list_yz'] as $v){?>
								<li><a href="index.php?act=goods&op=goods_detail&goods_id=<?php echo $v['goods_id']; ?>"><img src="<?php echo cthumb($v['goods_image'], 265, $_value['store_id']);?>"></a></li>
							<?php }?>
						</ul>&nbsp;
						<div style="clear: both; height: 12px;"></div>
					</div>
				</div>
				<div id="content3" class="mui-control-content">
					<div class="mui-table-view" style="padding:0 10px; float: left; width: 100%; min-height: 100%;">
						<ul class="fenlei_list pinpai_login" style="">
							<?php foreach($output['goods_list_ren'] as $v){?>
								<li><a href="index.php?act=goods&op=goods_detail&goods_id=<?php echo $v['goods_id']; ?>"><img src="<?php echo cthumb($v['goods_image'], 265, $_value['store_id']);?>"></a></li>
							<?php }?>								
						</ul>&nbsp;
						<div style="clear: both; height: 12px;"></div>
					</div>
				</div>
				<div id="content4" class="mui-control-content">
					<div class="mui-table-view" style="padding:0 10px; float: left; width: 100%; min-height: 100%;">
						<ul class="fenlei_list pinpai_login" style="">
							<?php foreach($output['goods_list_ms'] as $v){?>
								<li><a href="index.php?act=goods&op=goods_detail&goods_id=<?php echo $v['goods_id']; ?>"><img src="<?php echo cthumb($v['goods_image'], 265, $_value['store_id']);?>"></a></li>
							<?php }?>
						</ul>&nbsp;
						<div style="clear: both; height: 12px;"></div>
					</div>
				</div>
				<!--<div id="content5" class="mui-control-content">
					<div class="mui-table-view" style="padding:0 10px; float: left; width: 100%; min-height: 100%;">
						<ul class="fenlei_list pinpai_login" style="">
							<?php foreach($output['goods_list_wh'] as $v){?>
								<li><a href="index.php?act=goods&op=goods_detail&goods_id=<?php echo $v['goods_id']; ?>"><img src="<?php echo cthumb($v['goods_image'], 265, $_value['store_id']);?>"></a></li>
							<?php }?>
						</ul>&nbsp;
					</div>
				</div>-->


			</div>
		</div>
		<style>
		
		.pinpai_login li:nth-child(even){margin-left: 2%;}
		
			.mui-row.mui-fullscreen>[class*="mui-col-"] {
				height: 100%;
			}
			
			.mui-col-xs-3,
			.mui-control-content {
				overflow-y: auto;
				height: 100%;
			}
			
			.mui-segmented-control .mui-control-item {
				line-height: 50px;
				width: 100%;
			}
			
			.mui-segmented-control.mui-segmented-control-inverted .mui-control-item.mui-active {
				background-color: #fff !important;
				color: #bd9f61 !important;
			}
			
/*分类*/			
.fenlei_list {
	text-align: center;
}

.fenlei_list li {
	float: left;
	width: 49%;
	border: 1px solid #EEEEEE;
	font-size: 1.4rem !important;
	margin-top: 10px;
}

.fenlei_list img {
	width: 100%;
	margin: 0 auto;
}

.right-btn_fenlei {
	background: url(../images/16.png) no-repeat center;
	height: 50px;
	width: 28px;
	background-size: 26px;
	left: -10px;
	margin-top: -2px;
}
.right-btn_fenlei2 {
	background: url(../images/2_03.png) no-repeat center;
	height: 50px;
	width: 28px;
	background-size: 26px;
	left: -10px;
	margin-top: -2px;
}
.div_lable_genduo label {
	font-size: 1.2rem !important;
	border: 1px solid #DDDDDD;
	color: #66666;
	width: 22% !important;
	float: left;
	border-radius: 15px;
	padding: 3px 0px !important;
	background: #FFFFFF;
	margin: 5px;
}


		</style>
		<script src="<?php echo APP_TEMPLATES_URL;?>/js/mui.min.js"></script>
		<link rel="stylesheet" href="<?php echo APP_TEMPLATES_URL;?>/css/mui.min.css" />
		<script>
			mui.init({
				swipeBack: true //启用右滑关闭功能
			});
			var controls = document.getElementById("segmentedControls");
			var contents = document.getElementById("segmentedControlContents");
			/*var html = [];
			var mycars = new Array("推荐", "黄金", "白银", "铂金", "品牌");
			var i = 0,
				j = 1,
				m = mycars.length, //左侧选项卡数量+1
				n = 6; //每个选项卡列表数量+1
			for (; i < m; i++) {
				html.push('<a class="mui-control-item" href="#content' + i + '">' + mycars[i] + '</a>');
			}
			controls.innerHTML = html.join('');
			html = [];
			for (i = 0; i < m; i++) {
				html.push('<div id="content' + i + '" class="mui-control-content"><ul class="mui-table-view">');
				for (j = 0; j < n; j++) {
					html.push('<li class="mui-table-view-cell">第' + i + '个选项卡子项-' + j + '</li>');
				}
				html.push('</ul></div>');
			}
			contents.innerHTML = html.join('');*/
			//默认选中第一个
			controls.querySelector('.mui-control-item').classList.add('mui-active');
			contents.querySelector('.mui-control-content').classList.add('mui-active');
			(function($, doc) {
				$.plusReady(function() {
					//列表
					doc.getElementById("listGoing").addEventListener('tap', function() {
						$.openWindow({
							url: 'fenlei_list.html'
						});
					}, false);
					//更多 
					doc.getElementById("listGoing_genduo").addEventListener('tap', function() {
						$.openWindow({
							url: 'fenlei_list_genduo.html'
						});
					}, false);
					
					//index
				doc.getElementById('indexz').addEventListener('tap', function() {
					$.openWindow({
						url: 'index.html'
					});
				}, false);
				//购物车
				doc.getElementById('gouwuche').addEventListener('tap', function() {
					$.openWindow({
						url: 'gouwuche.html'
					});
				}, false);
				//会员中心
				doc.getElementById('tabbar-me-contact').addEventListener('tap', function() {
					$.openWindow({
						url: 'huiyuanzhongxin.html'
					});
				}, false);
				});
			}(mui, document));
		</script>